<template>
  <div>
    <el-card v-loading="loading">
      <div class="form">
        <el-form :inline="true">
          <el-form-item label="设备类型" prop="type">
            <el-select v-model="searchFormModel.type" placeholder="请选择--">
              <!-- <el-option
                v-for="(item, index) in deviceTypeList"
                :key="index"
                :label="item.name"
                :value="item.id"
              >
              </el-option> -->
            </el-select>
          </el-form-item>
          <el-form-item label="设备名称">
            <el-input v-model="searchFormModel.name" placeholder="请输入设备名称"></el-input>
          </el-form-item>
          <el-form-item label="设备编号">
            <el-input v-model="searchFormModel.imei" placeholder="请输入设备名称"></el-input>
          </el-form-item>
          
          <el-form-item>
            <el-button type="primary" @click="getList">查询</el-button>
          </el-form-item>
          <!-- <el-form-item>
            <el-button>重置</el-button>
          </el-form-item> -->
        </el-form>
      </div>
      <div slot="header">
        <el-button type="primary" size="small" @click="add">申请新排课</el-button>
        <!-- <el-button type="danger" size="small" @click="batchDelete">删除</el-button> -->
      </div>
      <el-table :data="tableData">
        <el-table-column type="index" width="65" align="center">
        </el-table-column>
        <el-table-column label="排课名称" align="center">
          <template slot-scope="scope">
            <el-button type="text" @click="lookCourse(scope.$index)">{{ scope.row.courseName}}</el-button>
          </template>
        </el-table-column>
        <el-table-column label="课程安排" align="center">
          <template slot-scope="scope">
            <div>
              <span>从第{{ scope.row.startWeek}}开始，{{weekClass[scope.row.ruleType]}}</span>
            </div>
            <div>
              <span>{{ timeSlot[scope.row.timerSloteId - 1].timeSlotName}}：{{timeSlot[scope.row.timerSloteId - 1].startTime}}--{{timeSlot[scope.row.timerSloteId - 1].endTime}}</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="创建时间" align="center">
          <template slot-scope="scope">
            {{ scope.row.createTime }}
          </template>
        </el-table-column>
        <el-table-column label="查看实验安排任务" align="center">
          <template slot-scope="scope">
            <el-button type="primary">查看</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-card>
  </div>
</template>

<script>
import request from '@/utils/request'
export default {
  data() {
    return {
      searchFormModel: {},
      loading: true,
      tableData: [],
      page: {
        currentPage: 1,
        total: 10,
        pageSize: 10
      },
      weekClass: ['每周上课', '单周上课', '双周上课', '整周上课'],
      timeSlot: []
    }
  },
  created() {
    this.getTimeSlot()
  },
  methods: {
    getList() {
      this.loading = true
      request.get('/labs/course/page', { params: {
        size: this.page.pageSize,
        current: this.page.currentPage
      }}).then(res => {
        if (!res.code) {
          this.tableData = res.content.records
          this.loading = false
        }
      })
    },
    async getTimeSlot() {
      await request.get('/items/labTimerSlot').then(res => {
        if (!res.code) {
          this.timeSlot = res.content
        }
      })
      await this.getList()
    },
    lookCourse(index) {
      this.$router.push({ path: `/teacherPlan/course/${this.tableData[index].id}` })
    }
  }
}
</script>

